<!DOCTYPE html>
<html lang="zh-CN">
<head>
    {% load static %}
    <meta charset="UTF-8">
    <meta content="IE=edge" http-equiv="X-UA-Compatible">
    <meta content="width=device-width, initial-scale=1" name="viewport">
    <meta content="" name="description">
    <meta content="" name="author">

    <link href="{% static 'bootstrap/css/bootstrap.min.css' %}" rel="stylesheet">
    <link href="{% static 'css/font-awesome.min.css' %}" rel="stylesheet">
    <link href="{% static 'css/main.css' %}" rel="stylesheet">
    <style>
        .tree li {
            list-style-type: none;
            cursor: pointer;
        }
        table tbody tr:nth-child(odd) {
            background: #F4F4F4;
        }
        table tbody td:nth-child(even) {
            color: #C00;
        }


    </style>
</head>

<body>

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
    <div class="container-fluid">
        <div class="navbar-header">
            <a class="navbar-brand" href="#" style="font-size:32px;">用户权限管理系统</a>
        </div>
        <div class="navbar-collapse collapse" id="navbar">
            <ul class="nav navbar-nav navbar-right">
                <li style="padding-top:8px;">
                    <div class="btn-group">
                        <button class="btn btn-default btn-success dropdown-toggle" data-toggle="dropdown"
                                type="button">
                            <i class="glyphicon glyphicon-user"></i>{{ request.session.info.name }}<span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu" role="menu">
                            <li><a href="#"><i class="glyphicon glyphicon-cog"></i> 个人设置</a></li>
                            <li><a href="#"><i class="glyphicon glyphicon-comment"></i> 消息</a></li>
                            <li class="divider"></li>
                            <li><a href="/logout/"><i class="glyphicon glyphicon-off"></i> 退出系统</a></li>
                        </ul>
                    </div>
                </li>
                <li style="margin-left:10px;padding-top:8px;">
                    <button class="btn btn-default btn-danger" type="button">
                        <span class="glyphicon glyphicon-question-sign"></span> 帮助
                    </button>
                </li>
            </ul>
            <form class="navbar-form navbar-right">
                <input class="form-control" placeholder="Search..." type="text">
            </form>
        </div>
    </div>
</nav>

<div class="container-fluid">
    <div class="row">
        <div class="col-sm-3 col-md-2 sidebar">
            <div class="tree">
                <ul class="list-group" style="padding-left:0px;">
                    <li class="list-group-item tree-closed">
                        <a href="/main"><i class="glyphicon glyphicon-dashboard"></i> 控制面板</a>
                    </li>
                    <li class="list-group-item">
                        <span><i class="glyphicon glyphicon-tasks"></i> 权限管理 <span class="badge"
                                                                                       style="float:right">3</span></span>
                        <ul style="margin-top:10px;">
                            <li style="height:30px;">
                                <a href="/user/list/"><i class="glyphicon glyphicon-user"></i> 用户管理</a>
                            </li>
                            <li style="height:30px;">
                                <a href="/role/list/"><i class="glyphicon glyphicon-king"></i> 角色管理</a>
                            </li>
                            <li style="height:30px;">
                                <a href="/label/list/"><i class="glyphicon glyphicon-lock"></i> 菜单管理</a>
                            </li>
                        </ul>
                    </li>
                    <li class="list-group-item tree-closed">
                        <span><i class="glyphicon glyphicon-ok"></i> 业务审核 <span class="badge"
                                                                                    style="float:right">3</span></span>
                        <ul style="margin-top:10px;display:none;">
                            <li style="height:30px;">
                                <a href="/auth_cert"><i class="glyphicon glyphicon-check"></i> 实名认证审核</a>
                            </li>
                            <li style="height:30px;">
                                <a href="/auth_adv"><i class="glyphicon glyphicon-check"></i> 广告审核</a>
                            </li>
                            <li style="height:30px;">
                                <a href="/auth_project"><i class="glyphicon glyphicon-check"></i> 项目审核</a>
                            </li>
                        </ul>
                    </li>
                    <li class="list-group-item tree-closed">
                        <span><i class="glyphicon glyphicon-th-large"></i> 业务管理 <span class="badge"
                                                                                          style="float:right">5</span></span>
                        <ul style="margin-top:10px;display:none;">
                            <li style="height:30px;">
                                <a href="/cert"><i class="glyphicon glyphicon-picture"></i> 图书入库</a>
                            </li>
                            <li style="height:30px;">
                                <a href="/type"><i class="glyphicon glyphicon-equalizer"></i> 借书</a>
                            </li>
                            <li style="height:30px;">
                                <a href="/process"><i class="glyphicon glyphicon-random"></i> 还书</a>
                            </li>
                            <li style="height:30px;">
                                <a href="/advertisement"><i class="glyphicon glyphicon-hdd"></i> 查询书库</a>
                            </li>
                            <li style="height:30px;">
                                <a href="/message"><i class="glyphicon glyphicon-comment"></i> 预约图书</a>
                            </li>
                        </ul>
                    </li>
                    <li class="list-group-item tree-closed">
                        <a href="/params"><i class="glyphicon glyphicon-list-alt"></i> 参数管理</a>
                    </li>
                </ul>
            </div>
        </div>
        {% block content %}{% endblock %}
    </div>
</div>

<script src="{% static 'jquery/jquery-2.1.1.min.js' %}"></script>
<script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
<script src="{% static 'script/docs.min.js' %}"></script>
<script type="text/javascript">
    $(function () {
            $(".list-group-item").click(function(){
                if ($(this).find("ul").length > 0) {
                    $(this).toggleClass("tree-closed");
                    if ($(this).hasClass("tree-closed")) {
                        $("ul", this).hide("fast");
                    } else {
                        $("ul", this).show("fast");
                    }
                }
            });

            // 处理删除操作
            $(".delete-btn").click(function(){
                var id = $(this).data("id");
                if(confirm("确认删除该条记录吗？")) {
                    // 使用 JavaScript 进行页面跳转
                    var deleteUrl = '/user/delete/?nid=' + id;
                    window.location.href = deleteUrl;
                }
            });

            $("tbody .btn-success").click(function(){
                window.location.href = "assignRole.html";
            });
            $("tbody .btn-primary").click(function(){
                window.location.href = "edit.html";
            });
        });


</script>
</body>
</html>